<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
    .IE8popup {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        padding: 10px;
        background: url(../img/opacity.png) repeat;
        overflow: hidden;
        z-index:999
    }
    .IE8popup  .close {
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        opacity: 1;
    }
    .IE8popup {
        width: 700px;
        height: 380px;
        margin-top: -190px;
        margin-left: -350px;
    }
    .IE8popup .manger-box {
        width: 680px;
        height: 320px;
        padding: 30px 42px 30px;
        background: #fff;
        overflow: hidden;
        position: relative;
        font-size: 16px;
    }
    .IE8popup .popup-title {
        height: 40px;
        padding: 0 20px;
        font: 16px/40px "微软雅黑";
        color: #fff;
        background: #f42533;
    }
    .IE8popup .popup-title i {
        display: inline-block;
        width: 12px;
        height: 12px;
        margin-top: 14px;
        overflow: hidden;
        cursor: pointer;
        background: url(../img/air-member.png) no-repeat -52px -98px;
    }

    .backdrop{
        display: none;
        position: fixed;
        z-index: 998;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        -webkit-transition-duration: 400ms;
        transition-duration: 400ms;
        background: url(../img/opacity.png) repeat;
    }
    .IE8popup em {
        font-style: normal; margin: 0px 0.1em; text-decoration: underline
    }
    .IE8popup ul li {
        list-style-type: disc
    }
    .IE8popup a {
        color: #08c
    }
    .IE8popup .manger-box>p>strong{
        font-size: 18px;
    }
    .IE8popup ul{
        position: relative;
        left: 20px;
    }
    .IE8popup ol{
        padding-top: 20px;
    }
    .fr{float:right;}
</style>
</head>
<body>
	<div class="test">test</div>

<script src="jquery.min.js"></script>
	<script>
	$(function(){
		var ieVersion=0;
		(function(window) {
		    var theUA = window.navigator.userAgent.toLowerCase();
		    if ((theUA.match(/msie\s\d+/) && theUA.match(/msie\s\d+/)[0]) || (theUA.match(/trident\s?\d+/) && theUA.match(/trident\s?\d+/)[0])) {
		        ieVersion = theUA.match(/msie\s\d+/)[0].match(/\d+/)[0] || theUA.match(/trident\s?\d+/)[0];
		    }
		})(window);
		$(".test").on("click",function(){
			if (ieVersion > 0 && ieVersion < 9) {
				var str = '<div class=" manage IE8popup" style="zoom: 1; display: block;">';
				var str2 = '<div class="popup-title">提示<i class="close fr"></i></div>';
				var str3 = '<div class="manger-box"><p><strong>如果您需要退换货操作，请您使用IE8以上浏览器，带来不便敬请谅解。</strong></p>';
				var str4 = '<ol><li>如果您使用的是<em>QQ浏览器</em><em>360浏览器</em><em>搜狗高速浏览器</em><em>傲游浏览器</em>或其他<strong>双核浏览器</strong><br>，请把浏览器切换至<strong>高速模式</strong></li><li>如果您使用的不是双核浏览器，请下载并使用以下任意一种浏览器重新打开本页面：<ul><li><a href="http://browser.qq.com/" target=_blank>QQ浏览器</a></li><li><a href="http://chrome.360.cn/" target=_blank>360极速浏览器</a> 或 <a href="http://se.360.cn/" target=_blank>360安全浏览器</a></li><li><a href="http://ie.sogou.com/" target=_blank>搜狗浏览器</a></li><li><a href="http://www.maxthon.cn/" target=_blank>傲游浏览器</a></li><li><a href="http://www.firefox.com.cn/" target=_blank>火狐浏览器</a></li><li><a href="http://www.google.cn/intl/zh-CN/chrome/browser" target=_blank>谷歌浏览器</a></li></ul></li></ol>';
	            $("body").append(str + str2 + str3 +str4);
            }		
		})
	})	
	</script>
</body>
</html>